<!--
 * @Author: 亚亚
-->
<!--
 * @Author: 亚亚
-->
<!--
 * @Author: 亚亚
-->
<!--
 * @Author: 亚亚
-->
<template>
  <el-form 
    :model="formData"
    :rules="formRules"
		v-bind="$attrs"
		ref="formRef"
  >
		<el-row>
			<el-col
				v-for="column in formColumns"
				:span="column.span || 24"
				:offset="column.offset"
			>
				<slot v-if="column.slotName" :name="column.slotName"></slot>
				<el-form-item
					v-else
					:label="column.label"
					:prop="column.prop"
					v-bind="column.formItemOpts"
				>
					<component
						:is="components[column.element]"
						v-bind="column"
						v-model="formData[column.prop]"
					/>
				</el-form-item>
			</el-col>
		</el-row>
  </el-form>
</template>

<script lang="ts" setup>
import type { FormInstance } from "element-plus";
import {autoImportComponents, autoImportProps} from './index'

const props = defineProps({
	formData: {
		type: Object,
		default: () => {}
	},
	formColumns: {
		type: Array,
		default: () => []
	},
  formRules: {
    type: Object,
		default: () => {}
  }
})

//自动引入对应组件和Props
const components = autoImportComponents()
autoImportProps(props)
console.log(props.formColumns,  111111111);

const formRef = ref<FormInstance>()
defineExpose({formRef})
</script>